import 'package:flutter/material.dart';
import 'package:photo_view/photo_view.dart';
import '/utils/load_image.dart';

// 全屏预览组件，默认显示一张图片，点击时全屏显示
class ImagePreview extends StatefulWidget {
  final String imageUrl;
  final double? width;
  final double? height;

  const ImagePreview({
    super.key,
    required this.imageUrl,
    this.width = 100,
    this.height = 100,
  });

  @override
  State<ImagePreview> createState() => _ImagePreviewState();
}

class _ImagePreviewState extends State<ImagePreview> {
  bool _isLargeImageVisible = false;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        setState(() {
          _isLargeImageVisible = true;
        });
        Navigator.push(
          context,
          PageRouteBuilder(
            opaque: false,
            pageBuilder: (context, animation, secondaryAnimation) => FullScreenImagePage(widget.imageUrl),
          ),
        );
      },
      child: loadImageByUrl(widget.imageUrl, widget.width!, widget.height!),
    );
  }
}

// 全屏图片显示组件
class FullScreenImagePage extends StatelessWidget {
  final String imageUrl;

  const FullScreenImagePage(this.imageUrl, {super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: GestureDetector(
        onTap: () => Navigator.of(context).pop(),
        child: Center(
          child: PhotoView(
            imageProvider: imageUrl.startsWith('http') ? NetworkImage(imageUrl) : AssetImage(imageUrl),
            maxScale: PhotoViewComputedScale.contained * 3,
            minScale: PhotoViewComputedScale.contained * 0.5,
          ),
        ),
      ),
    );
  }
}